<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
<div id="app">
	<!-- 父组件向子组件传递方法，使用的是事件机制， v-on,当我们自定义了一个 事件属性之后，那么，子组件就能够，通过某些方式，来调用 传递进去的这个方法了 -->
	<com2 @func="show"></com2>
	<h3>{{ datamsgFormSon }}</h3>
</div>
<template id="tmpl">
	<div>
		<h1>这是 子组件</h1>
		<input type="button" @click="myclick" value="这是子组件中的按钮 - 点击它，触发 父组件传递过来的 func 方法">
	</div>
</template>
<script src="node_modules/vue/dist/vue.js"></script>
<script>
var com2 = {
	template:'#tmpl',
	data(){
		return {
			sondata:{title:'这个是子组件的数据标题', content:'这个是子组件的数据内容'}
		}
	},
	methods:{
		myclick(){
			// emit 英文原意：是触发，调用，发射的意思
			this.$emit('func', this.sondata)
		}
	}
}
var app = new Vue({
	el:'#app',
	data:{datamsgFormSon:'这个是父组件内的方法,'},
	methods:{
		show(sonjson){
			this.datamsgFormSon += sonjson.title + ',' + sonjson.content
			// console.log('这个是父组件内的方法,' + sonjson.title + ',' + sonjson.content)
		}
	},
	components:{
		com2
	}
})
</script>
</body>
</html>